<template>
<view class="city-info">

  <!-- #ifdef APP-PLUS -->
  <picker @change=" pickerChange " :value=" cityIndex " :range=" cityList " range-key="title" v-if=" location.lat && location.lng ">
    <view class="city-info flex-y-center">
      <view>
        <block v-if=" cityList && cityList.length > 0 ">
          {{ cityIndex === -1 ? '未知' : cityList[ cityIndex ].title.length > 3 ? cityList[ cityIndex ].title.substring(0,3) + '...': cityList[ cityIndex ].title }}
        </block>
        <block v-else>请选择</block>
      </view>
      <i class="iconfont iconshaixuanxia-1 ml-sm"></i>
    </view>
  </picker>
  <view @tap.stop="toOpenLocation" class="city-info flex-y-center" v-else>
    <view> 未知 </view>
    <i class="iconfont iconshaixuanxia-1 ml-sm"></i>
  </view>

  <!-- #endif -->
  <!-- #ifndef APP-PLUS -->
  <picker @change=" pickerChange " :value=" cityIndex " :range=" cityList " range-key="title">
    <view class="city-info flex-y-center">
      <view>
        <block v-if=" cityList && cityList.length > 0 ">
          {{ cityIndex === -1 ? '未知' : cityList[ cityIndex ].title.length > 3 ? cityList[ cityIndex ].title.substring( 0, 3 ) + '...': cityList[ cityIndex ].title }}
        </block>
        <block v-else>请选择</block>
      </view>
      <i class="iconfont iconshaixuanxia-1 ml-sm"></i>
    </view>
  </picker>
  <!-- #endif -->

  <!-- #ifdef MP-WEIXIN -->
  <user-privacy ref="user_privacy" :show=" false " />
  <!-- #endif -->

  <open-city-item ref="open_city_item" :height=" popupHeight " />

</view>
</template>
<script>
import {
  mapState,
  mapActions,
  mapMutations
} from "vuex"

export default {
  name: "city-info", data() {
    return {
      popupHeight: '',
    }
  }, computed: mapState( {
    cityIndex: state => state.technician.cityIndex,
    cityList: state => state.technician.cityList,
  } ), methods: {
    ...mapMutations( [
      'updateTechnicianItem',
    ] ), ...mapActions( [
      'updateUserItem',
    ] ), pickerChange( $event ) {
      console.log( 'pickerChange', $event );
      let ind = $event.target.value
      this.updateTechnicianItem( {
        key: 'cityIndex',
        val: ind
      } )
      this.updateTechnicianItem( {
        key: 'cityId',
        val: this.cityList[ ind ].id
      } )
      this.getList( 1 )
    }, async getList( page = 0, refresh = false ) {
      if( page ) {
        let param = this.$util.deepCopy( this.param )
        param.page = page
        this.updateTechnicianItem( {
          key: 'param',
          val: param
        } )
      }
      this.loading = true
      let {
        location,
        locaRefuse,
        changeAddr
      } = this

      let {
        realtime_location = 0
      } = this.configInfo


      let {
        status: coach_status,
        coach_position
      } = this.userCoachStatus

      if( this.param.page == 1 ) {
        if(
            // #ifdef APP-PLUS
            !locaRefuse &&
            // #endif
            ( ( !location.lat || ( location.lat && location.address == '暂未获取到位置信息' ) ) || ( refresh && realtime_location && !changeAddr ) )
        ) {

          // #ifdef MP-WEIXIN
          var privacyCheck = this.$refs.user_privacy.check()
          if( privacyCheck ) {
            this.$refs.user_privacy.open()
            this.isLoad = true
            this.loading = false
            this.$util.hideAll()
            return
          }
          // #endif

          if( coach_status == 2 && coach_position ) {
            let {
              lat: change_lat = 0,
              lng: change_lng = 0,
              unix = 0
            } = this.changeOnAddr
            let cur_unix = this.$util.DateToUnix( this.$util.formatTime( new Date(), 'YY-M-D h:m:s' ) )
            let noloca = change_lat && change_lng && ( unix && ( cur_unix - unix < 3 ) ) ? false : true
            if( !noloca ) {
              let loca = Object.assign( {}, this.location, {
                lat: change_lat,
                lng: change_lng,
                is_util_loca: 1
              } )
              this.updateUserItem( {
                key: 'location',
                val: loca
              } )
            }
            this.updateUserItem( {
              key: 'noChangeLoca',
              val: {
                noloca,
                refresh
              }
            } )
            if( this.noChangeLoca.noloca ) return
            await this.initUtilLocaData( refresh )
          } else {
            await this.getUtilLocation( refresh )
          }
        } else {
          await this.initUtilLocaData( refresh )
        }
        return
      }
      await this.initUtilLocaData( refresh )
    }, initFixHeight( val ) {
      this.popupHeight = val
    }, async initUtilLocaData( refresh ) {
      this.updateUserItem( {
        key: 'noChangeLoca',
        val: {
          noloca: false
        }
      } )
      let {
        changeAddr
      } = this

      let {
        realtime_location = 0
      } = this.configInfo

      let {
        lng = 0,
        lat = 0,
        is_util_loca = 0
      } = this.location

      if( refresh ) {
        let {
          coach_id: cid = 0
        } = this.param
        await this.getCityList( {
          lng,
          lat,
          change: cid ? 0 : 1
        } )
      }

      // #ifdef APP-PLUS
      if( !lat && !lng ) {
        this.updateTechnicianItem( {
          key: 'cityIndex',
          val: -1
        } )
        this.isLoad = true
        this.loading = false
        this.$util.hideAll()
        this.updateTechnicianItem( {
          key: 'list',
          val: {
            data: [],
            last_page: 1,
            current_page: 1
          }
        } )
        return
      }
      // #endif

      let {
        list: oldList,
        activeIndex,
        tabList,
        cityList,
        cityIndex,
        cityId: city_id
      } = this

      let param = this.$util.deepCopy( this.param )

      let ind = cityList.findIndex( item => {
        return item.id == city_id
      } )

      if( ind == -1 ) {
        if( param.page == 1 && ( is_util_loca || ( realtime_location && !changeAddr ) ) ) {
          await this.$util.getMapInfo( true, {}, changeAddr )
        }
        // this.$refs.choose_city_item.open()
        if( this.$refs.open_city_item ) {
          this.$refs.open_city_item.initIndex()
        }
        this.loading = false
        this.$util.hideAll()
        this.updateTechnicianItem( {
          key: 'list',
          val: {
            data: [],
            last_page: 1,
            current_page: 1
          }
        } )
        return
      }


      city_id = ind == -1 ? 0 : city_id
      cityIndex = ind == -1 ? 0 : ind
      this.updateTechnicianItem( { key: 'cityIndex', val: cityIndex } )
      this.updateTechnicianItem( { key: 'cityId', val: city_id } )
      let { coach_format = 1, coach_filter_show = 0 } = this.configInfo
      param = Object.assign( {
      }, param, this.check, { lat, lng, city_id } )
      if( coach_format == 1 ) {
        param.type = tabList[ activeIndex ].id
      }
      if( !coach_filter_show ) {
        delete param.sex
        delete param.cate_id
        delete param.recommend
        delete param.free_fare
        delete param.service_type
        delete param.store_name
      } else {
        if( param.sex === -1 ) {
          delete param.sex
        }
        if( param.recommend === 0 ) {
          delete param.recommend
        }
        if( param.cate_id === 0 ) {
          delete param.cate_id
        }
        if( param.service_type === 0 ) {
          delete param.service_type
        }
      }
      await this.getServiceCoachList( param )
      this.loading = false
      this.$util.hideAll()
      if( param.page == 1 && ( is_util_loca || ( realtime_location && !changeAddr ) ) ) {
        this.$util.getMapInfo( true, {}, changeAddr )
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.city-info {
  width: 170rpx;
}
</style>
